<template>
	<view class="content">
		<view class="customerList">
			<view class="messageList">
				<label for="" style="font-size: 26rpx;letter-spacing: 5rpx;color: #62b074;font-weight: 600;">套餐名称：</label>
				<input type="text" v-model="meal.mealName" value="" placeholder="请输入详细信息" />
			</view>
			<view class="messageList">
				<label for="" style="font-size: 26rpx;letter-spacing: 5rpx;color: #62b074;font-weight: 600;">套餐时长(时)：</label>
				<input type="text" v-model="meal.duration" value="" placeholder="请输入详细信息" />
			</view>
			<view class="messageList">
				<label for="" style="font-size: 26rpx;letter-spacing: 5rpx;color: #62b074;font-weight: 600;">套餐价格(元)：</label>
				<input type="text" v-model="meal.price" value="" placeholder="请输入详细信息" />
			</view>
			<view class="messageList" v-if="store.holidayMeal==1">
				<label for=""
					style="font-size: 26rpx;letter-spacing: 5rpx;color: #62b074;font-weight: 600;">平时价格(元)：</label>
				<input type="text" v-model="meal.normalPrice" value="" placeholder="请输入详细信息" />
			</view>
			<view class="messageList" v-if="store.holidayMeal==1">
				<label for=""
					style="font-size: 26rpx;letter-spacing: 5rpx;color: #62b074;font-weight: 600;">节假日价格(元)：</label>
				<input type="text" v-model="meal.holidayPrice" value="" placeholder="请输入详细信息" />
			</view>
			<view class="messageList">
				<label for=""
					style="font-size: 26rpx;letter-spacing: 5rpx;color: #62b074;font-weight: 600;">美团套餐id：</label>
				<input type="text" v-model="meal.meituanDealId" value="" placeholder="请输入详细信息" />
			</view>
		</view>
		<view class="afrim" @click="save()">保存套餐</view>
		<view class="uni-container">
			<uni-table ref="table" :loading="loading" border stripe type="selection" emptyText="暂无更多数据">
				<uni-tr>
					<uni-th width="150" align="center">团购名称</uni-th>
					<uni-th width="150" align="center">美团id</uni-th>
				</uni-tr>
				<uni-tr v-for="(item, index) in tableData" :key="index">
					<uni-td>{{ item.title }}</uni-td>
					<uni-td align="center">{{ item.dealId }}</uni-td>
				</uni-tr>
			</uni-table>
		</view>
		<view style="height: 150rpx;"></view>
	</view>
</template>

<script>
	import Api from '@/common/api';
	import {
		mapState
	} from 'vuex';
	export default {
		computed: {
			...mapState(['hasLogin', 'userInfo'])
		},
		data() {
			return {
				meal: {},
				value: 0,
				yesChecked: false,
				noChecked: false,
				storeId: null,
				store:null,
				searchVal: '',
				tableData: [],
				// 每页数据量
				pageSize: 10,
				// 当前页
				pageCurrent: 1,
				// 数据总量
				total: 0,
				loading: false
			};
		},
		onLoad(options) {
			let id = options.id;
			let storeId = options.storeId;
			this.storeId = storeId;
			this.getStore(options.storeId)
			this.meal.storeId = storeId;
			if (typeof id != 'undefined') {
				this.getMealById(id);
			}
			this.getMeituanMeal(this.meal.storeId);
		},
		methods: {
			handleChange(e) {
				this.value = e.detail.value;
				this.meal.isXufei = this.value;
				console.log(this.value)
			},
			async getMeituanMeal(storeId) {
				let data = await Api.apiCall('get', Api.meal.getMeituanMeal, {
					storeId: storeId
				});
				if (data) {
					this.tableData = data
				}
			},
			async getMealById(mealId) {
				let data = await Api.apiCall('get', Api.meal.getMealById, {
						mealId: mealId
					});
				if(data){
					this.meal = data;
					this.value = this.meal.isXufei;
					console.log(this.value)
					if(this.value==0){
						this.noChecked = true;
					}
					if(this.value==1){
						this.yesChecked = true;
					}
				}
			},
			async getStore(storeId) {
				let data = await Api.apiCall('get', Api.qsg.getStore, {
						storeId: storeId
					});
				if(data){
					this.store = data;
				}
			},
			async save() {
				let params = {
					id: this.meal.id,
					mealName: this.meal.mealName,
					price: this.meal.price,
					duration: this.meal.duration,
					useTime: this.meal.useTime,
					isSale: this.meal.isSale,
					createDatetime: this.meal.createDatetime,
					integral:this.meal.integral,
					comment: this.meal.comment,
					storeId: this.meal.storeId,
					endTime: this.meal.endTime,
					isXufei:this.meal.isXufei,
					isSpecialTime:this.meal.isSpecialTime,
					meituanDealId: this.meal.meituanDealId,
					normalPrice: this.meal.normalPrice,
					holidayPrice: this.meal.holidayPrice,
				}
				let data = await Api.apiCall('post', Api.meal.create, params);
				console.log(data)
				if(data){
					uni.showModal({
						title: '提示',
						content: '已成功保存套餐.',
						success: function(res) {
							if (res.confirm) {
							} else if (res.cancel) {
					
							}
						}
					});
				}
			}
		}
	}
</script>

<style>
	.afrim{
		width: 650rpx;
		height: 80rpx;
		background: #0DA944;
		border-radius: 30rpx;
		font-size: 28rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #FFFFFF;
		line-height: 80rpx;
		text-align: center;
		position: fixed;
		z-index: 2;
		bottom: calc(100% - 95%);
		margin-left: 40rpx;
	}
	.customerType {
		display: inline-block;
		height: 80rpx;
		line-height: 80rpx;
		vertical-align: top;
		text-align: right;
		padding-right: 30rpx;
		font-size: 30rpx;
	}

	.pickerType {
		width: 540rpx;
		display: inline-block;
		vertical-align: top;
		text-align: left;
	}

	.pickerType view {
		height: 80rpx;
		line-height: 80rpx;
		font-size: 30rpx;
	}

	.upBox {
		padding: 0 30rpx;
	}

	.upBox text {
		display: inline-block;
		padding: 20rpx 0;
	}

	.messageList {
		width: 750rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
		border-bottom: 1px solid #F8F8F8;
	}

	.messageList label {
		display: inline-block;
		height: 80rpx;
		line-height: 80rpx;
		vertical-align: top;
		text-align: right;
		padding-right: 30rpx;
		font-size: 30rpx;
	}

	.messageList input {
		height: 80rpx;
		vertical-align: top;
		display: inline-block;
		line-height: 80rpx;
		font-size: 28rpx;
	}

	.fan {
		position: relative;
		padding: 30rpx 0;
	}

	.fan button {
		position: absolute;
		top: 30rpx;
		left: 0;
		width: 750rpx;
		height: 480rpx;
		background: none;
		border: none;
	}

	.fanMian {
		width: 750rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
	}

	.fanMian image {
		width: 690rpx;
		height: 480rpx;
	}

	.examTit {
		width: 750rpx;
		height: 80rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
		line-height: 80rpx;
		font-size: 30rpx;
	}

	.examTit text {
		font-size: 24rpx;
		color: #ff1d31;
	}

	.examTit {
		width: 750rpx;
		height: 80rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
		line-height: 80rpx;
		font-size: 30rpx;
	}

	.examTit text {
		font-size: 24rpx;
		color: #ff1d31;
	}

	.fan {
		position: relative;
		padding: 30rpx 0;
	}

	.fan button {
		position: absolute;
		top: 30rpx;
		left: 0;
		width: 750rpx;
		height: 480rpx;
		background: none;
		border: none;
	}

	.fanMian {
		width: 750rpx;
		padding: 0 30rpx;
		box-sizing: border-box;
	}

	.fanMian image {
		width: 690rpx;
		height: 480rpx;
	}
</style>
